<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>修改密码</title>
    <link rel="stylesheet" href="../../../static/libs/layui/css/layui.css">
    <link rel="stylesheet" href="../../../static/css/commom.css">
</head>
<body>
    <div class="layui-fluid">
        <div class="layui-card">
            <div class="layui-card-body">
                <form class="layui-form layui-row" id="pwdForm" lay-filter="pwdForm">
                    <div class="layui-col-xs12 layui-col-sm6 layui-col-md6">
                        <div class="layui-input-block layui-red pwdTips">请输入正确的旧密码，新密码必须两次输入一致才能提交</div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">用户名</label>
                            <div class="layui-input-block">
                                <input name="username" th:value="${session.adminUser.username}" type="text" value="" disabled="" class="layui-input layui-disabled">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label required">旧密码</label>
                            <div class="layui-input-block">
                                <input type="password" value="" name="oldPwd" placeholder="请输入旧密码" lay-verify="required|oldPwd"
                                    class="layui-input pwd layui-form-danger">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label required">新密码</label>
                            <div class="layui-input-block">
                                <input type="password" name="newPwd" value="" placeholder="请输入新密码" lay-verify="required|newPwd"
                                    id="oldPwd" class="layui-input pwd">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label required">确认密码</label>
                            <div class="layui-input-block">
                                <input type="password" name="password" wdvalue="" placeholder="请确认密码" lay-verify="required|confirmPwd"
                                    class="layui-input pwd">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <div class="layui-input-block">
                                <button class="layui-btn" lay-submit="" lay-filter="changePwd">立即修改</button>
                                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <script src="../../../static/libs/layui/layui.js"></script>
    <script src="../../../static/js/common.js"></script>
    <script th:inline="javascript">
        var oldPwd = [[${session.adminUser.password}]];
    </script>
    <script>
        layui.use(['form'],function () {  
            var form = layui.form;
            //添加验证规则
            form.verify({
                oldPwd : function(value, item){
                	if(value.length < 8){
                        return "密码错误，请重新输入！";
                    }
                },
                newPwd : function(value, item){
                    if(value.length < 8){
                        return "密码长度不能小于8位";
                    }
                },
                confirmPwd:function(value, item){
                    if((value.length != $("#oldPwd").val().length) || (!new RegExp($("#oldPwd").val()).test(value))){
                        return "两次输入密码不一致，请重新输入！";
                    }
                }
            });
         	// 表单提交事件
            form.on('submit(changePwd)', function (data) {
            	var url = '/sysUserController/updatePassword';
            	layer.load(2);
                $.get(url, data.field, function (res) {
                    layer.closeAll('loading');
                    if (res.success == true) {
                        layer.msg(res.msg, { icon: 1 });
                    } else {
                        layer.msg(res.msg, { icon: 2 });
                    }
                }, 'json').fail(function (res,status,xhr) {
                    //todo:异常处理
                    layer.closeAll('loading');
                    layer.msg(res.responseJSON.message);
                });
                return false;
            });
        })
    </script>
</body>
</html>